<!DOCTYPE html>
<html th:lang="#{lang}">
<head>
    <title th:text="|${comic.title}-#{title}|"></title>
    <meta name="keywords" th:content="|${comic.title},#{keywords}|">
    <meta name="description" th:content="|${comic.intro}-#{description}|">
    <div th:replace="common/meta"></div>
    <style>
        .cartoon_list h2{
            height: auto;
        }
    </style>
</head>
<body>
<div th:replace="common/header-back:: header(${comic.title},${lang})"></div>

<div th:replace="common/cate:: cate(${cates})"></div>

<div class="cartoon_introduce">
    <div class="cartoon_introduce_bg">
        <img th:src="${comic.cover}" alt="">
        <span class="mengban"></span>
    </div>
    <div class="cover">
        <ul>
            <li class="pic"><img th:src="${comic.cover}" th:alt="${comic.title}"></li>
            <li class="title" th:text="${comic.title}">TITLE</li>
            <li class="author" th:text="|#{comic.author}:${comic.author}|">author</li>
            <li class="type" th:text="|#{comic.type}:${comic.cate}|">type</li>
            <li class="number" th:text="|#{comic.hits}:${comic.hits}|">hits</li>
            <li class="but_group">
                <input data-click="read_first_comic" class="read" type="button" th:value="#{comic.read}">
                <input data-click="app_download_alert" class="subscribe" type="button" th:value="#{comic.favorite}">
            </li>
        </ul>
    </div>
    <div class="introduce">
        <p class="" th:text="|#{comic.intro}:${comic.intro}|">作品简介：</p>
    </div>
</div>
<div class="cartoon_catalog cartoon_list">
    <h2><span th:text="|[${comic.title}]#{comic.menu}|">[title]menu</span> </h2>
    <ul>
        <li th:each="chapter,state:${list}">
            <a th:href="${'/comic/chapter/'+comic.id+'/'+chapter.id}">
                <h6 class="ellipsis" style="padding-left: 20px;" th:text="${chapter.title}">两不疑3新书预售！</h6>
            </a>
        </li>
    </ul>
</div>

<div th:replace="common/footer"></div>
</body>
<div th:replace="common/js"></div>
<script th:inline="javascript">
    var comicId=[[${comic.id}]];
    var chapterId=[[${firstId}]];
</script>
<script type="text/javascript">
jQuery(document).ready(function () {

    $('[data-click=read_first_comic]').on('click', function () {
        location.href = "/comic/chapter/"+comicId+"/"+chapterId;
    });

});
</script>
</html>